<!--
/*
 * Licensed to the OpenAirInterface (OAI) Software Alliance under one or more
 * contributor license agreements.  See the NOTICE file distributed with
 * this work for additional information regarding copyright ownership.
 * The OpenAirInterface Software Alliance licenses this file to You under
 * the OAI Public License, Version 1.1  (the "License"); you may not use this file
 * except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.openairinterface.org/?page_id=698
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *-------------------------------------------------------------------------------
 * For more information about the OpenAirInterface (OAI) Software Alliance:
 *      contact@openairinterface.org
 */

/*! \file common/utils/websrv/frontend/src/app/components/info/info.component.html
 * \brief: implementation of web interface frontend for oai
 * \info component web interface implementation (works with info.component.ts)
 * \author:  Yacine  El Mghazli, Francois TABURET
 * \date 2022
 * \version 0.1
 * \company NOKIA BellLabs France
 * \email: yacine.el_mghazli@nokia-bell-labs.com  francois.taburet@nokia-bell-labs.com
 * \note
 * \warning
 */
-->
<div class="grid-container" > 
  <mat-grid-list cols="1" rowHeight="15vh" >
    <mat-grid-tile [colspan]="1" [rowspan]="6" >
      <mat-card class="dashboard-card">	
        <mat-card-header >
          <mat-card-title>Connection info</mat-card-title>
        </mat-card-header>
        <mat-card-content class="dashboard-card-content">
          <div *ngIf="infos$ | async as infos">
            <div  class="infodiv" *ngFor="let info of infos">
              <mat-form-field class="scrollablefield" >
                <mat-label>{{ info.nameFC.value }}</mat-label>
                <input matInput [formControl]="info.valueFC" [readonly]="!info.modifiableFC.value" />
              </mat-form-field>
              <button  mat-raised-button  color="primary"  (click)="onInfoSubmit(info)" *ngIf="info.modifiableFC.value" >
                {{ info.btnTxtFC }}
              </button>
            </div>
          </div>
        </mat-card-content>
      </mat-card>
    </mat-grid-tile>
  </mat-grid-list>
</div>
